<template>
    <s-layout>
        <view class="team">
            <view class="team-tab">
                <view class="team-tab-box">
                    <view class="tab-item" v-for="(item,index) in tablist" :key="index">
                        <view :class="{'active':current===index}" @click="handleTab(index)">{{item}}</view>
                    </view>
                </view>
            </view>
            <!-- 我的订单 -->
            <scroll-view class="team-box" scroll-y="true" refresher-enabled="true" :refresher-triggered="triggered" refresher-background="#f8f4f3" @refresherrefresh="onRefresh" @scrolltolower='lower'>
                <view v-if="orderList.length > 0">
                    <view v-for="(goods,index) in orderList" :key="index" @click="goInfo(goods.goodsId)">
                        <uni-card :is-shadow="false" :border="false">
                            <view class="card-top">
                                <view class="card-top-left">
                                    <text style="color: #999; font-size: 24rpx;" class="mr-2">订单编号: {{goods.goodsOrderId}}</text>
                                    <view @click.stop="copy(goods.goodsOrderId)">
                                        <u-image src="/static/img/copy.png" width="24rpx" height="24rpx"></u-image>
                                    </view>
                                </view>
                                <text style="color: #000; font-size: 24rpx;">{{tablist[goods.status-2]}}</text>
                            </view>
                            <u-divider></u-divider>
                            <view class="goodsItem">
                                <view>
                                    <u-image :showLoading="true" :src="goods.urlLink" width="200rpx" height="200rpx" radius="10rpx"></u-image>
                                </view>
                                <view class="goodsInfo">
                                    <view class="title">
                                        <view style="color: #000;font-weight: 700;flex:1;" class="wordLimit">{{goods.goodsName}}</view>
                                        <!-- <view v-if="goods.status>3" style="width: 50rpx;margin-left: 10rpx;">
                                                              <u-tag text="真" type="warning" plain size="mini" v-if="goods.examinersResult == 1"></u-tag>
                                                              <u-tag text="假" type="error" plain size="mini" v-if="goods.examinersResult == 0"></u-tag>
                                                            </view> -->
                                    </view>
                                    <view style="display: flex;justify-content: space-between;">
                                        <!-- <text style="color: #999; font-size: 24rpx;">单价: {{goods.orderItems[0].goodsPrice}}</text> -->
                                        <!-- <text style="color: #999; font-size: 24rpx;" class="ml-6">购买数量: {{goods.orderItems[0].goodsQuantity}}</text> -->
                                        <view style="color: red;font-weight: 700;">¥ {{goods.price}}</view>
                                    </view>
                                    <view class="dis_f_l_c" style="color: #999; font-size: 24rpx;">
                                        <view class="m_r_5">游戏ID: {{goods.gameIdNo || ""}}</view>
                                        <view @click.stop="copy(goods.gameIdNo)">
                                            <u-image src="/static/img/copy.png" width="24rpx" height="24rpx" ></u-image>
                                        </view>
                                    </view>
                                    <text style="color: #999; font-size: 24rpx;">游戏区服: {{goods.gameAreaType || ""}}</text>
                                    <text style="color: #999; font-size: 24rpx;">备注: {{goods.remark || ""}}</text>
                                    <text style="color: #999; font-size: 24rpx;">打手: {{goods.waiterName || ""}}</text>
                                    <text style="color: #999; font-size: 24rpx;">下单时间: {{goods.createTime}}</text>
                                    <text style="color: #999; font-size: 24rpx;">队友: {{goods.memberIdsName}}</text>
                                    <!-- <view class="dis_f_r_c m_t_10" v-if="goods.status == 2">
                                                          <view  @click.stop="removeOder(goods.goodsOrderId)">
                                                              <u-button type="error" size="small" >取消订单</u-button>
                                                          </view>
                                                      </view> -->
                                    <view class="dis_f_r_c m_t_10" >
                                        <view @click.stop="handleEnd(goods.goodsOrderId)" v-if="goods.status == 3">
                                            <u-button type="primary" size="small">完成</u-button>
                                        </view>
                                        <view class="m_l_5" @click.stop="handleAdd(goods.goodsOrderId)" v-if="goods.status == 3||goods.status == 4">
                                            <u-button type="warning" size="small">添加队友</u-button>
                                        </view>
                                    </view>
                                </view>
                            </view>
                        </uni-card>
                    </view>
                    <uni-load-more :status="loadStatus" :contentText="contentText" />
                </view>
                <s-empty v-else />
            </scroll-view>
            <!-- 授权弹窗 -->
            <s-auth-modal />
            <!-- 下单提现服务费弹窗 -->
            <u-modal :show="showAddOrder" title="支付" :showCancelButton="true" @confirm="topUp" @cancel="showAddOrder = false" confirm-color="#2979ff">
                <!-- 自定义内容区域 -->
                <view class="content-container">
                    <view class="amount-section">
                        <text class="amount-label">总金额</text>
                        <text class="amount-number">¥ {{ Number(cruGoods.totalAmount) +( isCheck.length>0?Number(cruGoods.fee):Number(cruGoods.fee2)) }}</text>
                    </view>
                    <view class="fee-reminder">
                        <u-icon name="error-circle" color="#ff9900" size="28"></u-icon>
                        <text class="fee-text">服务费：{{ cruGoods.fee }}元（10%）</text>
                    </view>

                    <view class="protocol">
                        <u-radio-group v-model="payType">
                            <u-radio name="1" label="微信支付"></u-radio>
                            <view class="m_l_10">
                                <u-radio name="2" label="余额支付"></u-radio>
                            </view>
                        </u-radio-group>
                    </view>

                    <view class="protocol">
                        <u-checkbox-group v-model="isCheck" placement="column">
                            <u-checkbox :name="1"></u-checkbox>
                        </u-checkbox-group>
                        是否需要核查
                    </view>
                    <view class="protocol">
                        <u-checkbox-group v-model="checkboxValue" placement="column">
                            <u-checkbox :name="1"></u-checkbox>
                        </u-checkbox-group>
                        <view>
                            本人已阅读并签署
                            <text class="link" @click="goProtocol(2)">《商品购买需知》</text>
                            和
                            <text class="link" @click="goProtocol(6)">《核查员合作协议》</text>
                        </view>
                    </view>
                </view>
            </u-modal>
            <!-- 完成上传服务截图 -->
            <u-modal :show="showImg" title="服务截图" :showCancelButton="true" @cancel="showImg = false" @confirm="handleConfirm">
                <view class="orderImg">
                    <u-upload :fileList="fileList1" accept="image" @afterRead="afterRead" @delete="deletePic" name="1" multiple :maxCount="9" :max-size="20 * 1024 * 1024" @oversize="oversize"></u-upload>
                    <view style="font-size: 24rpx;color: #666666">服务截图, 上传大小不超过20M</view>
                    <view class="code">
                        <u--textarea v-model="remark" placeholder="备注信息"></u--textarea>
                    </view>
                </view>
            </u-modal>
            <!-- 收货地址 -->
            <u-modal :show="showAddress" title="收货地址" :showCancelButton="true" @confirm="handleConfirmAddress" @cancel="showAddress = false">
                <u--form labelPosition="left" :model="addressForm">
                    <u-form-item label="姓名" prop="relName" ref="item1">
                        <u--input v-model="addressForm.relName" placeholder="请输入收货姓名"></u--input>
                    </u-form-item>
                    <u-form-item label="电话" prop="phonenumber" ref="item2">
                        <u--input v-model="addressForm.phonenumber" placeholder="请输入收货电话"></u--input>
                    </u-form-item>
                    <u-form-item label="地址" prop="address" ref="item2">
                        <u--input v-model="addressForm.address" placeholder="请输入收货地址"></u--input>
                    </u-form-item>
                </u--form>
            </u-modal>
            <!-- 收货地址 -->
            <u-modal :show="showAdd" title="添加队友" :showCancelButton="true" @confirm="handleConfirmAdd" @cancel="showAdd = false">
                <u--form labelPosition="left">
                    <u-form-item label="队友ID"  ref="item1">
                        <u--input v-model="userIds" placeholder="请输入队友ID"></u--input>
                    </u-form-item>
                </u--form>
            </u-modal>
        </view>
    </s-layout>
</template>

<script>
import {
    oderListApi,
    topUpApi,
    removeOderApi,
    confirmOrderApi,
    resubmitOrderApi,
    getByKeyApi,
    getRoomIdApi,
    getTopUpApi,
    confirmedApi,
    complaintsApi,
    getIsRefundApi,
    addOrderApi,
    createOrderByAmountApi,
    updateOrderAddressApi,
    putOrderRemoveApi,
    putOrderWaiterEndApi, putAddMemberApi,
} from "@/sheep/api/index";
import { baseUrl } from "@/sheep/request/baseUrl";
export default {
    data() {
        return {
            userIds:'',
            payType: "1",
            isCheck: [1],
            tablist: ["全部", "进行中", "待结单", "已完成", "已退款"],
            current: 0,
            triggered: false,
            loadStatus: "",
            contentText: {
                contentdown: "查看更多",
                contentrefresh: "加载中",
                contentnomore: "没有更多了",
            },
            paramsPage: {
                pageNum: 1,
                pageSize: 10,
                isWaiter: 1,
            },
            orderList: [],
            topUpForm: {
                payWay: "WX_XCX_PAY",
                amount: "",
                attach: "",
                orderType: "goods",
                desc: "商品购买",
            },
            isWxOrder: false,
            checkboxValue: [0],
            showAddOrder: false,
            cruGoods: {},
            showReturn: false,
            showAddress: false,
            fileList1: [],
            complaintsForm: {
                complaintsVideo: null,
                complaintsInfo: "",
                orderId: null,
            },
            addressForm: {
                relName: "",
                address: "",
                phonenumber: "",
                orderId: null,
            },
            cruOrderId: null, //当前要完成的订单id
            showImg: false, //展示上传服务图片
            remark: "", //完成订单备注信息
            goodsOrderId:'',
            showAdd:false,
        };
    },
    onLoad(options) {
        this.current = Number(options.type);
        if (this.current) {
            this.paramsPage.status = this.current + 2;
        }
        this.getList();
        // this.getIsWxOrderList();
    },
    methods: {
        handleCall(phone) {
            uni.makePhoneCall({
                phoneNumber: phone,
            });
        },
        goExaminers(orderId) {
            uni.navigateTo({
                url: "/pages/examiners/edit?orderId=" + orderId,
            });
        },
        goProtocol(value) {
            uni.navigateTo({ url: "/pages/protocol/index?type=" + value });
        },
        goChat(userId, nickName) {
            getRoomIdApi({ userId }).then((res) => {
                if (res.code == 200) {
                    uni.navigateTo({
                        url: `/pages/chat/chatDetail?roomId=${res.data}&nickName=${nickName}`,
                    });
                }
            });
        },
        handleAdd(goodsOrderId){
            this.goodsOrderId = goodsOrderId
            this.showAdd=true
        },
        handleConfirmAdd(){
            if (!this.userIds){
                uni.showToast({
                    title: "请输入队友ID",
                    icon: "none",
                });
                return
            }
            putAddMemberApi({ orderId:this.goodsOrderId,userIds:this.userIds}).then((res) => {
                uni.showToast({
                    title: res.msg,
                    icon: "none",
                });
                if (res.code == 200){
                    this.handleTab(this.current);
                    this.userIds=''
                    this.showAdd = false
                }
            });
        },
        handlePay(item) {
            this.showAddOrder = true;
            this.cruGoods = item;
        },
        topUp(item) {
            if (!this.checkboxValue[0]) {
                uni.showToast({
                    title: "请同意商品购买需知",
                    icon: "none",
                });
                return;
            }
            if (this.payType == 1) {
                this.topUpForm.amount =
                    this.isCheck.length > 0
                        ? Number(this.cruGoods.totalAmount) + Number(this.cruGoods.fee)
                        : Number(this.cruGoods.totalAmount) + Number(this.cruGoods.fee2);
                this.topUpForm.attach = this.cruGoods.orderId;
                this.topUpForm.orderType = this.isCheck.length > 0 ? "goods" : "goods2";
                topUpApi(this.topUpForm).then(({ data }) => {
                    let that = this;
                    uni.requestPayment({
                        provider: "wxpay",
                        timeStamp: data.timeStamp,
                        nonceStr: data.nonceStr,
                        package: data.packageValue,
                        signType: data.signType,
                        paySign: data.paySign,
                        success: function (res) {
                            that.handleTab(2);
                            that.showAddOrder = false;
                        },
                        fail: function (err) {},
                    });
                });
            } else {
                createOrderByAmountApi({
                    orderId: this.cruGoods.orderId,
                    goodsQuantity: 1,
                    isCheck: this.isCheck.length > 0 ? 1 : 0,
                }).then((res) => {
                    if (res.code == 200) {
                        this.handleTab(2);
                        this.showAddOrder = false;
                    }
                });
            }
        },
        confirmOrder(orderId) {
            let that = this;
            uni.showModal({
                title: "提示",
                content: "确定要收货吗？",
                success: function (res) {
                    if (res.confirm) {
                        confirmOrderApi(orderId).then((res) => {
                            if (res.code == 200) {
                                uni.showToast({
                                    title: "确认收货成功",
                                    duration: 1500,
                                });
                                that.handleTab(this.current);
                            }
                        });
                    }
                },
            });
        },
        confirmWxOrder(orderId) {
            getTopUpApi(orderId).then((res) => {
                //拉起确认收货组件
                if (wx.openBusinessView) {
                    wx.openBusinessView({
                        businessType: "weappOrderConfirm",
                        extraData: {
                            merchant_id: "1699480442",
                            merchant_trade_no: res.topUpId,
                            transaction_id: res.transactionId,
                        },
                        success() {
                            confirmOrderApi(orderId).then((res) => {
                                if (res.code == 200) {
                                    uni.showToast({
                                        title: "确认收货成功",
                                        duration: 1500,
                                    });
                                    that.handleTab(this.current);
                                }
                            });
                        },
                        fail(errormsg) {
                            console.log("fail", errormsg);
                        },
                        complete(errormsg) {
                            console.log("complete", errormsg);
                        },
                    });
                } else {
                    //引导用户升级微信版本
                    uni.showToast({
                        title: "微信版本过低，无法使用此功能，请升级到最新微信版本后重试。",
                        duration: 1500,
                    });
                }
            });
        },
        resubmitOrder(orderId) {
            resubmitOrderApi(orderId).then((res) => {
                if (res.code == 200) {
                    uni.showToast({
                        title: "发起审核成功",
                        duration: 1500,
                    });
                    this.handleTab(3);
                }
            });
        },
        removeOder(goodsGoodsId) {
            //二次确认
            let that = this;
            uni.showModal({
                title: "提示",
                content: "确定要取消吗？",
                success: function (res) {
                    if (res.confirm) {
                        putOrderRemoveApi({ orderId: goodsGoodsId }).then((res) => {
                            uni.showToast({
                                title: res.msg,
                                icon: "none",
                            });
                            that.handleTab(this.current);
                        });
                    }
                },
            });
        },
        handleEnd(goodsOrderId) {
            this.cruOrderId = goodsOrderId;
            this.showImg = true;
        },
        handleConfirm() {
            if (this.fileList1.length == 0) {
                uni.showToast({
                    title: "请上传服务截图",
                    icon: "none",
                });
                return;
            }
            // 二次确认
            let that = this;
            uni.showModal({
                title: "提示",
                content: "确定要完成订单吗？",
                success: function (res) {
                    if (res.confirm) {
                        let serverImg = "";
                        if (Array.isArray(that.fileList1)) {
                            if (that.fileList1.length > 0) {
                                that.fileList1.forEach((item, index) => {
                                    if (index === 0) {
                                        serverImg = item.ossId;
                                    } else {
                                        serverImg = serverImg + "," + item.ossId;
                                    }
                                });
                            } else {
                                serverImg = "";
                            }
                        }
                        putOrderWaiterEndApi({
                            orderId: that.cruOrderId,
                            serverImg: serverImg,
                            serverRemark: that.remark,
                        }).then((res) => {
                            uni.showToast({
                                title: res.msg,
                                icon: "none",
                            });
                            that.showImg = false;
                            that.handleTab(that.current);
                        });
                    }
                },
            });
        },
        showReturnOder(goods) {
            this.cruGoods = goods;
            this.showReturn = true;
        },
        // 申请退款
        async returnOder(goods) {
            //查询是否已申请
            let isReturn = await getIsRefundApi(goods.orderId);
            if (isReturn.data) {
                uni.showToast({
                    title: "已申请过退款",
                    icon: "none",
                });
                return;
            }
            //二次确认
            let that = this;
            const orderId = goods.orderId;
            uni.showModal({
                title: "提示",
                content:
                    "申请退款需要先支付核查费用, 待审核通过后购买商品时的支付金额将会全额退还，请确认",
                success: function (res) {
                    if (res.confirm) {
                        const topUpForm = {
                            amount: Number(goods.fee),
                            attach: orderId,
                            payWay: "WX_XCX_PAY",
                            orderType: "returnOder",
                            desc: "核查费用",
                        };
                        topUpApi(topUpForm).then(({ data }) => {
                            uni.requestPayment({
                                provider: "wxpay",
                                timeStamp: data.timeStamp,
                                nonceStr: data.nonceStr,
                                package: data.packageValue,
                                signType: data.signType,
                                paySign: data.paySign,
                                success: function (res) {
                                    //发送退款审核
                                    uni.showToast({
                                        title: "发起退款成功",
                                        icon: "none",
                                    });
                                    that.handleTab(that.current);
                                },
                                fail: function (err) {
                                    uni.showToast({
                                        title: "支付失败",
                                        icon: "none",
                                    });
                                },
                            });
                        });
                    }
                },
            });
        },
        submitReturnOder() {
            if (this.fileList1.length == 0) {
                uni.showToast({
                    title: "请上传开箱视频",
                    icon: "none",
                });
                return;
            }
            //二次确认
            let that = this;
            uni.showModal({
                title: "提示",
                content:
                    "申请退款需要先支付核查费用, 待审核通过后购买商品时的支付金额将会全额退还，请确认",
                success: function (res) {
                    if (res.confirm) {
                        const topUpForm = {
                            amount: Number(that.cruGoods.fee),
                            attach: that.cruGoods.goodsId,
                            payWay: "WX_XCX_PAY",
                            orderType: "agreedComplaints",
                            desc: "核查费用",
                        };
                        topUpApi(topUpForm).then(({ data }) => {
                            uni.requestPayment({
                                provider: "wxpay",
                                timeStamp: data.timeStamp,
                                nonceStr: data.nonceStr,
                                package: data.packageValue,
                                signType: data.signType,
                                paySign: data.paySign,
                                success: function (res) {
                                    //审核信息
                                    that.complaintsForm.orderId = that.cruGoods.orderId;
                                    if (Array.isArray(that.fileList1)) {
                                        if (that.fileList1.length > 0) {
                                            that.fileList1.forEach((item, index) => {
                                                if (index === 0) {
                                                    that.complaintsForm.complaintsVideo = item.ossId;
                                                } else {
                                                    that.complaintsForm.complaintsVideo =
                                                        that.complaintsForm.complaintsVideo +
                                                        "," +
                                                        item.ossId;
                                                }
                                            });
                                        } else {
                                            that.complaintsForm.examinersVideo = "";
                                        }
                                    }
                                    complaintsApi(that.complaintsForm).then((res) => {
                                        if (res.code == 200) {
                                            uni.showToast({
                                                title: "发起退款成功",
                                                icon: "none",
                                            });
                                            that.complaintsForm = {
                                                complaintsVideo: null,
                                                complaintsInfo: "",
                                                orderId: null,
                                            };
                                            that.showReturn = false;
                                            that.handleTab(that.current);
                                        }
                                    });
                                },
                                fail: function (err) {
                                    uni.showToast({
                                        title: "支付失败",
                                        icon: "none",
                                    });
                                },
                            });
                        });
                    }
                },
            });
        },
        confirmedOrder(orderId) {
            //二次确认
            let that = this;
            uni.showModal({
                title: "提示",
                content: "确定要接受此核查结果吗？",
                success: function (res) {
                    if (res.confirm) {
                        confirmedApi(orderId).then((res) => {
                            uni.showToast({
                                title: res.msg,
                                icon: "none",
                            });
                            that.handleTab(that.current);
                        });
                    }
                },
            });
        },
        copy(value) {
            uni.setClipboardData({
                data: value,
                success: function () {},
            });
        },
        handleTab(index) {
            this.current = index;
            this.paramsPage.status = index === 0 ? null : index + 2;
            this.paramsPage.pageNum = 1;
            this.orderList = [];
            this.getList();
        },
        async getList() {
            const { rows } = await oderListApi(this.paramsPage);
            this.orderList = this.orderList.concat(rows);
            this.triggered = false;
            if (rows?.length < this.paramsPage.pageSize) {
                this.loadStatus = "noMore";
            } else {
                this.loadStatus = "more";
            }
        },
        goInfo(goodsId) {
            uni.navigateTo({
                url: "/pages/index/info?goodsId=" + goodsId,
            });
        },
        async getIsWxOrderList() {
            let res = await getByKeyApi("is_wx_order");
            this.isWxOrder = res.data[0].configValue == "0";
        },
        // 下拉刷新
        onRefresh() {
            this.triggered = true;
            this.orderList = [];
            this.paramsPage.pageNum = 1;
            this.getList();
        },
        // 触底了
        lower() {
            if (this.loadStatus !== "noMore") {
                this.paramsPage.pageNum++;
                this.getList();
            }
        },
        // 上传图片
        async afterRead(event) {
            let lists = [].concat(event.file);
            let fileListLen = this[`fileList${event.name}`].length;
            lists.map((item, index) => {
                this[`fileList${event.name}`].push({
                    ...item,
                    status: "uploading",
                    message: "上传中",
                });
            });
            for (let i = 0; i < lists.length; i++) {
                const result = await this.uploadFilePromise(lists[i].url, lists, event);
                let item = this[`fileList${event.name}`][fileListLen];
                this[`fileList${event.name}`].splice(
                    fileListLen,
                    1,
                    Object.assign(item, {
                        status: "success",
                        message: "",
                        url: result.url,
                        name: result.fileName,
                        ossId: result.ossId,
                    })
                );
                fileListLen++;
            }
        },
        uploadFilePromise(url, lists, event) {
            let token = uni.getStorageSync("token");
            let headerToken = "Bearer " + token;
            return new Promise((resolve, reject) => {
                let a = uni.uploadFile({
                    url: baseUrl + "/resource/oss/upload",
                    filePath: url,
                    name: "file",
                    header: {
                        Authorization: headerToken,
                        clientId: "be7052a7e4f802c20df10a8d131adb12",
                    },
                    formData: {
                        user: "test",
                    },
                    success: (res) => {
                        let data = JSON.parse(res.data);
                        if (data.code == 200) {
                            resolve(data.data);
                        } else {
                            if (lists.length > 0) {
                                lists.map((item, index) => {
                                    this[`fileList${event.name}`].splice(index, 1);
                                });
                            }
                            uni.showToast({
                                title: data.msg,
                                icon: "none",
                            });
                        }
                    },
                });
            });
        },
        // 删除图片
        deletePic(event) {
            this[`fileList${event.name}`].splice(event.index, 1);
        },
        // 文件超出大小限制
        oversize() {
            uni.showToast({
                title: "上传最大不能超过20M",
                icon: "none",
            });
        },
        handleConfirmAddress() {
            updateOrderAddressApi(this.addressForm).then((res) => {
                if (res.code === 200) {
                    this.showAddress = false;
                    uni.showToast({
                        title: "修改成功",
                        icon: "none",
                    });
                    this.handleTab(that.current);
                }
            });
        },
        handleAddPhone(orderId) {
            this.showAddress = true;
            this.addressForm.orderId = orderId;
        },
    },
};
</script>

<style lang="scss" scoped>
.active {
    font-weight: 700;
    position: relative;
    &::after {
        content: "";
        width: 57rpx;
        height: 5rpx;
        background-color: #58be6b;
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
    }
}
.team {
    .team-tab {
        height: 110rpx;
        .team-tab-box {
            width: 100%;
            height: 110rpx;
            line-height: 110rpx;
            background-color: #fff;
            border-bottom: 2rpx solid rgba($color: #5d5d5d, $alpha: 0.1);
            position: fixed;
            left: 0;
            right: 0;
            z-index: 99;
            display: flex;
            padding: 0 24rpx;
            overflow-x: auto;
            .tab-item {
                height: 100%;
                flex: 1;
                text-align: center;
                color: #000000;
                font-size: 24rpx;
            }
        }
    }
    .team-box {
        height: calc(100vh - 110rpx);
        background-color: #f0f0f0;
        ::v-deep .u-divider.data-v-239d3faa {
            margin: 15rpx 0;
        }
        .card-top {
            display: flex;
            justify-content: space-between;
            .card-top-left {
                display: flex;
                align-items: center;
            }
        }
        .goodsItem {
            display: flex;
            position: relative;
            .goodsInfo {
                flex: 1;
                padding: 0 0 0 15rpx;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                .wordLimit {
                    overflow: hidden;
                    display: -webkit-box;
                    -webkit-line-clamp: 2;
                    /* 设置最大显示行数 */
                    -webkit-box-orient: vertical;
                    text-overflow: ellipsis;
                }
                .title {
                    display: flex;
                    justify-content: space-between;
                    .price {
                        display: -webkit-box;
                        -webkit-box-orient: vertical;
                        -webkit-line-clamp: 1;
                        overflow: hidden;
                        text-overflow: ellipsis;
                    }
                }
                .goodsNum {
                    display: flex;
                    justify-content: space-around;
                }
                .btn {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                }
                .goodsBut {
                    display: flex;
                    border-radius: 10rpx;
                    font-size: 24rpx;
                    padding: 0 20rpx;
                    // width: 120rpx;
                    // height: 40rpx;
                    background-color: #ff7433;
                    color: #fff;
                    align-items: center;
                    justify-content: center;
                    // border: #dddddd 1rpx solid;
                }
            }
        }
    }
}
.content-container {
    padding: 20rpx;
    text-align: center;
}

.amount-section {
    margin: 30rpx 0;

    .amount-label {
        display: block;
        color: #666;
        font-size: 28rpx;
        margin-bottom: 20rpx;
    }

    .amount-number {
        font-size: 48rpx;
        font-weight: bold;
        color: #2979ff;
    }
}

.fee-reminder {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20rpx;
    background-color: #fff9e6;
    border-radius: 12rpx;
    margin-top: 30rpx;

    .fee-text {
        color: #999;
        font-size: 24rpx;
        margin-left: 10rpx;
    }
}
.protocol {
    margin-top: 40rpx;
    font-size: 24rpx;
    color: #999;
    display: flex;
    .link {
        color: #2979ff;
    }
}
.img {
    //绝对定位
    position: absolute;
    right: 20rpx;
    top: -10rpx;
    z-index: 99;
}
.orderImg {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    .code {
        margin-top: 20rpx;
        width: 100%;
        display: flex;
        justify-content: center;
    }
}
</style>
